<template>
    <h2>房型修改</h2>
    
    <table class="table table-bordered">
        <tr>
            <td>类型名称</td>
            <td>
                <input type="text" v-model="info.typename"/>
            </td>
        </tr>
        <tr>
            <td>门市价格</td>
            <td>
                <input type="text" v-model="info.price"/>元
            </td>
        </tr>
        <tr>
            <td>房间大小</td>
            <td>
                <input type="text" v-model="info.size"/>平米
            </td> 
        </tr>
        <tr>
            <td>状态</td>
            <td>
                <input type="radio" :value="true" v-model="info.tState"/>启用
                <input type="radio" :value="false" v-model="info.tState"/>禁用
            </td> 
        </tr>
        <tr>
            <td colspan="2">
                <input type="button" value="修改" class="btn btn-info" @click="Add"/>
            </td>
        </tr>
    </table>
    
    
    
    </template>
        
    <script setup lang="ts">
    import {ref,onMounted} from 'vue'
    import axios from 'axios'
    import { useRouter,useRoute } from 'vue-router';
    const router=useRouter()
    const route=useRoute()
    const info=ref({
        typename:'',
        price:'',
        size:'',
        tState:true
    })
    
    const Add=()=>{
        var obj={
            typeid:route.params.id,
            typename:info.value.typename,
            price:info.value.price,
            size:info.value.size,
            tState:info.value.tState
        }
        axios.put('https://localhost:7173/api/Room/RoomTypeUpd',obj)
    
        .then(res=>{
            if(res.data==-1){
                alert('该房型已存在请勿重复添加')
            }
            else if(res.data>0){
                alert('修改成功')
                router.push('/RoomTypeShow')
            }
            else{
                alert('修改失败')
            }
        })
        .catch(err=>{
            console.log(err)
        })
    }
    

    onMounted(()=>{
        axios.get('https://localhost:7173/api/Room/GetRoomType',{
            params:{
                id:route.params.id
            }
        })
        .then(res=>{
            info.value=res.data
        })
    })
    
    </script>